/* eslint-disable react-refresh/only-export-components */
import React from "react";
import { xqyApi } from "../../api/city";
import styles from "./css/index.module.css";
import Header from "../../comdentens/Header";
import List from "./cnmdcnm/List";
import { useLoaderData } from "react-router-dom";
function Index() {
  const { res } = useLoaderData();
  console.log(res);
  return (
    <div className={styles.box}>
      <Header title="详情页面" />
      <div className={styles.zhuti}>
        <List sss={res} />
        <div className={styles.aaaa}>
          <div>
            <span>二等座</span>
            <span>{res.fsoftSeat.price}</span>
            <span>定购</span>
          </div>
          <div>
            <span>一等座</span>
            <span>{res.ssoftSeat.price}</span>
            <span>定购</span>
          </div>
          <div className={styles.aaaa}>
            <span>二等座</span>
            <span>{res.businessSeat.price}</span>
            <span>定购</span>
          </div>
        </div>
      </div>
    </div>
  );
}

export default Index;
export const loader = async ({ params, request }) => {
  const id = params.id;
  const url = new URL(request.url);
  const data = Object.fromEntries(url.searchParams);
  console.log(id, data);
  const { data: res } = await xqyApi(id, data);
  return { res };
};
